<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户列表</title>
    <link rel="stylesheet" type="text/css" href="/static/hplus/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/static/hplus/css/style.css">
    <link rel="stylesheet" type="text/css" href="/static/layer/skin/layer.css">
    <style type="text/css">
        .form-control {width: 220px;}
        .ttd {width: 250px;text-align: center;}
        .ttb {width: 80px;text-align: center;}
    </style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <form action="{:url('lists')}" method="get">
                        <table style="width: 100%;padding: 0;border: none">
                            <tr>
                                <td class="ttd">
                                    <input type="text" name="keyword" placeholder="账号/手机号" class="input-sm form-control" value="{$param.keyword}">
                                </td>
                                <td class="ttd">
                                    <select class="form-control" name="status">
                                        <option value="">…用户状态…</option>
                                        {foreach $status as $k=>$v}
                                        <option value="{$k}" {if(intval($param.status)===$k)}selected="1"{/if}>{$v}</option>
                                        {/foreach}
                                    </select>
                                </td>
                                <td class="ttb"><input type="submit" class="btn btn-sm btn-primary" value="搜索"></td>
                                <td>
                                    <a href="javascript:;" id="add">添加</a> |
                                    <a href="javascript:;" data-action="enableAll">批量启用</a> |
                                    <a href="javascript:;" data-action="disableAll">批量禁用</a> |
                                    <a href="javascript:;" data-action="delAll">批量删除</a> |
                                    <a href="javascript:;" data-action="refreshAll">批量重刷</a>
                                </td>
                                <td>&nbsp;</td>
                            </tr>
                        </table>
                    </form>
                </div>
                <div class="ibox-content">
                    <table id="treeTable"></table>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript" src="/static/hplus/js/jquery.min.js?v={php}echo time(){/php}"></script>
<script type="text/javascript" src="/static/layer/layer.js?v={php}echo time(){/php}"></script>
<script type="text/javascript" src="/static/royui/royui.min.js?v={php}echo time(){/php}"></script>
<script>
    $(function () {
        //let $data = JSON.parse('<?php echo json_encode($list); ?>');
        let r = new royui();
        r.treeTable({
            elem: '#treeTable',
            //data: $data,
            url: '{:url("lists")}',
            method: 'post',
            //is_cache: false,
            count: {$count},
            checkbox: true,
            paging: true,
            pages: {$pages},
            show_pages: 5,
            cols: [
                {
                    field: 'username',
                    title: '账号'
                },
                {
                    title: '用户头像',
                    template: function ($item) {
                        return '<a href="' + $item.avatar + '" target="_blank"><img src="' + $item.avatar + '" onerror="this.style.display=\'none\'" style="min-height: 30px;min-width: 30px;max-height: 60px;max-width: 60px;margin: 5px 0;border-radius: 50%;"></a>'
                    }
                },
                {
                    field: 'mobile',
                    title: '手机号'
                },
                {
                    field: 'name',
                    title: '真实姓名'
                },
                {
                    field: 'gender',
                    title: '性别',
                    template: function ($item) {
                        let $gender = parseInt($item.gender)
                        if ($gender === 1) {
                            return '男';
                        } else if ($gender === 2) {
                            return '女';
                        } else {
                            return '保密';
                        }
                    }
                },
                {
                    field: 'user_attr.school_name',
                    title: '所属学校'
                },
                {
                    field: 'user_attr.grade_name',
                    title: '所属年级'
                },
                {
                    field: 'user_attr.class_name',
                    title: '所属班级'
                },
                {
                    field: 'login_count',
                    title: '登录次数',
                    title_style: 'cursor:pointer',
                    is_sort: true
                },
                {
                    field: 'login_time',
                    title: '登录时间',
                    title_style: 'cursor:pointer',
                    is_sort: true
                },
                {
                    field: 'ctime',
                    title: '注册时间',
                    title_style: 'cursor:pointer',
                    is_sort: true
                },
                {
                    field: 'status_txt',
                    title: '状态'
                },
                {
                    title: '操作',
                    action: [{matter: 'details', url: '{:url("detail")}'}, {matter: 'del', url: '{:url("del")}'}],
                    template: function ($item) {
                        let $str = '待审核', $status = parseInt($item.status);
                        if ($status === 1) {
                            $str = '<a href="javascript:;" class="royui-button-a" data-action="disable" data-id="' + $item.id + '">禁用</a>'
                        } else if ($status === 4) {
                            $str = '<a href="javascript:;" class="royui-button-a" data-action="enable" data-id="' + $item.id + '">启用</a>'
                        }
                        $str += ' &nbsp; <a href="javascript:;" class="royui-button-a" data-action="refresh" data-id="' + $item.id + '">重刷</a>';
                        return $str;
                    },
                    site: 'after'
                }
            ]
        })
        let $open = null;
        $('#add').click(function () {
            $open = layer.open({
                type: 2,
                title: '添加用户',
                content: '{:url("add")}',
                area: ['600px', '700px'],
                closeBtn: 2,
                btn: ['确定', '取消'],
                yes: function ($index, $layero) {
                    let $body = $layero.find('iframe').contents().find('body');
                    let $param = decodeURIComponent($($body).find('form').serialize());
                    $param = $param.split('&');
                    let $params = {};
                    $($param).each(function ($n, $obj) {
                        $params[$obj.split('=')[0]] = $obj.split('=')[1];
                    });
                    if (!$params['username']) {
                        layer.msg('登录账号不能为空', {icon: 5, time: 1000});
                        return false
                    }
                    if (!$params['mobile']) {
                        layer.msg('手机号不能为空', {icon: 5, time: 1000});
                        return false
                    }
                    if (!$params['nickname']) {
                        layer.msg('昵称不能为空', {icon: 5, time: 1000});
                        return false
                    }
                    if (!$params['password'] || !$params['pwd1']) {
                        layer.msg('登录密码不能为空', {icon: 5, time: 1000});
                        return false
                    }
                    if ($params['pwd1'] !== $params['password']) {
                        layer.msg('再次输入的密码不一致', {icon: 5, time: 1000});
                        return false
                    }
                    if (!$params['category']) {
                        layer.msg('请选择用户角色', {icon: 5, time: 1000});
                        return false
                    }
                    if (!$params['name']) {
                        layer.msg('真实姓名不能为空', {icon: 5, time: 1000});
                        return false
                    }
                    if (!$params['idcard']) {
                        layer.msg('身份证号不能为空', {icon: 5, time: 1000});
                        return false
                    }
                    $.ajax({
                        type: 'post', dataType: 'json', cache: false,
                        url: '{:url("add")}',
                        data: $params,
                        success: function ($data) {
                            if ($data['code'] === 200) {
                                layer.msg($data.message, {icon: 1, time: 1200}, function () {
                                    layer.close($open);
                                    window.location.reload();
                                });
                            } else {
                                layer.msg($data.message, {icon: 5});
                            }
                        }
                    })
                }
            })
        })
        $('body').on('click', 'a[data-action]', function () {
            let $action = $(this).data('action'), $id = $(this).data('id');
            let $ids = [];
            if ($action === 'del' || $action === 'disable' || $action === 'enable' || $action === 'mip' || $action === 'nip' || $action === 'refresh') {
                $ids = [$id];
            } else if ($action === 'delAll' || $action === 'disableAll' || $action === 'enableAll' || $action === 'mipAll' || $action === 'nipAll' || $action === 'refreshAll') {
                $('.royui_checkbox').each(function () {
                    if ($(this).is(':checked')) {
                        $ids.push($(this).val())
                    }
                });
            }
            operate($ids, $action)
        });

        function operate($ids, $type) {
            let $msg = '', $tip = '';
            if ($type === 'delAll') {
                $msg = '确实要删除吗？';
                $tip = '删除'
            } else if ($type === 'disable' || $type === 'disableAll') {
                $msg = '确实要禁用吗？';
                $tip = '禁用'
            } else if ($type === 'enable' || $type === 'enableAll') {
                $msg = '确实要启用吗？';
                $tip = '启用'
            } else if ($type === 'mip' || $type === 'mipAll') {
                $msg = '确实要免IP吗？'
                $tip = '免IP';
            } else if ($type === 'nip' || $type === 'nipAll') {
                $msg = '确实要限制IP吗？';
                $tip = '限制IP';
            } else if ($type === 'refresh' || $type === 'refreshAll') {
                $msg = '确实要重刷吗？';
                $tip = '重刷';
            }
            if ($ids.length === 0) {
                layer.msg('请选择要' + $tip + '的项');
                return false
            }
            layer.confirm($msg, {icon: 3}, function () {
                $.ajax({
                    type: 'post', cache: false, dataType: 'json',
                    url: '{:url("operate")}',
                    data: {'ids': $ids, 'type': $type},
                    success: function (data) {
                        if (data.code === 200) {
                            layer.msg(data.message, {icon: 1, time: 1000}, function () {
                                location.reload();
                            });
                        } else {
                            layer.msg(data.message, {icon: 5})
                        }
                    }
                })
            })
        }
    });
</script>
</html>
